<template>
	<div>
		<div style="width:100%;height:524px;background-color:#F7F7F7;padding-top:0.1px;">
			<div class="chat">
				<span>
					<img src="./images/chat.jpg" />
				</span>
				<div class="rig">
					<p class="tit-name">{{title}}</p>
					<p class="pri-sal">￥{{price}}</p>
				</div>

			</div>
			<div class="send-pro">发送商品</div>
		</div>
		<div class="foot2">
			<input type="text" name="" class="send">
			<div class="pic-2">
				<span>
					<img src="./images/tu_2.png" class="pic_3">
				</span>
				<span>
					<img src="./images/tu_1.png">
				</span>
			</div>
			<div class="send-tex">发送</div>
		</div>
	</div>
</template>
<script>
	export default{

        props:['title','price'],
        created () {
            console.log(this.title);
        }
	}
</script>
<style>
.send-pro{
	width:140px ;
	height: 26px;
	font-size: 1.2rem;
    line-height: 26px;
    display: block;
    color: #fb2a5c;
    margin: 5px auto 0;
    border-radius: 5px;
    border: solid 2px #fb2a5c;
    text-align: center;
    position: absolute;
    top: 110px;
    left: 88px;

}
.chat{
	width: 87%;
	height: 115px;
	padding-bottom: 15px;
	display: flex;
	justify-content: space-between;
	background-color: #fff;
	margin:30px auto;
}
.chat>span{
	width: 60px;
	height: 60px;
	display: inline-block;
    margin-top: 10px;
    margin-left: 8px;
}
.chat>span>img{
	width: 60px;
	height: 60px;
}
.chat>.rig{
	width: 85%;
	height: 80px;
	margin-left: 10px;
	margin-top: 10px;
}
.chat>.rig>.tit-name{
	height: 32px;
    line-height: 16px;
    color: #444;
    padding-top: 5px;
    overflow: hidden;
    font-size: 1.1rem;
    text-indent: 10px;
}
.chat>.rig>.pri-sal{
	font-size: 1.3rem;
	color: #df3130;
	line-height: 22px;
	margin-top: 5px;
}
.foot2{
	width: 100%;
	height: 44px;
	background-color:#EEEEEE;
	border-top: solid 1px #ccc;
	display: flex;
	justify-content:space-between;
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: 50;
}
.foot2>.send{
	width:43% ;
	height:26px ;
	font-size: 1rem;
	outline: none;
	/*box-sizing: border-box;*/
	border-radius: 5px;
	margin-top: 10px;
	margin-left: 20px;
	border-color: #ccc;

}
.foot2>.pic-2{
	width:25%;
	height:38px ;
	padding-top: 8px;
	margin-left: 5px;
}
.foot2>.pic-2>span{
	width: 30px;
	height: 30px;

}
.foot2>.pic-2 img{
	width: 30px;
	height: 30px;
}
.foot2>.pic-2 .pic_3{
	margin-right: 10px;
}
.foot2>.send-tex{
	background: #c0c0c0;
	margin-top: 5px;
    color: #fff;
    border-radius: 5px;
    height: 34px;
    line-height: 34px;
    font-size: 18px;
    text-align: center;
    width: 18%;
    margin-right:10px;
}
</style>
